import React from 'react';
import Api from 'Utils/api';
import dialog from 'Utils/dialog';
import moment from 'moment/moment';
import { RESOURCE_HOST } from 'Constants/config';
import './index.scss';

class DetailPage extends React.PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      documentId: props.params.id,
      record: {}
    }
    this.getDetail = ::this.getDetail;
  }
  componentWillMount() {
    this.getDetail();
  }
  getDetail() {
    const api = new Api({
      method: 'GET',
      path: `/documents/${this.state.documentId}`,
      success: (json) => {
        this.setState({
          record: json
        });
      },
      error: (msg) => {
        const buttons = [
          {
            label: '知道了',
            onClick: () => {},
          },
        ];
        dialog.open('提示', msg, buttons, 'center');
      }
    });
    api.run();
  }
  render() {
    const { record } = this.state;
    return (
      <div className="normal-work-detail-page">
        <div className="document-title">{ record.title || '' }</div>
        <div className="document-time">发布时间：{ record.modify_time ? moment(record.modify_time).format('YYYY年MM月DD') : '' }</div>
        <div className="document-content">
          {
            record.media ? <img src={`${RESOURCE_HOST}${record.media}`} alt="" /> : ''
          }
          {
            record.content ? <span dangerouslySetInnerHTML={{ __html: record.content.replace(/\n/g, '<br/>') }} /> : ''
          }
        </div>
      </div>
    )
  }
}

export default DetailPage;
